$(function () {

  // 全局查询参数对象
  var QueryObj = {
    page: 1,
    pageSize: 2
  };
  // 总页数
  var totalPage = 1;

  init();
  function init() {
    querySecondCategoryPaging();
    queryTopCategoryPaging();
    initFileUpload();
    setFormValite();
  }

  // 查询二级分类
  function querySecondCategoryPaging(callback) {
    $.get("/category/querySecondCategoryPaging", QueryObj, function (result) {
      // console.log(result);
      // <tr><th>序号</th><th>一级分类名称</th><th>二级分类名称</th><th>二级分类LOGO</th></tr>
      var rows = result.rows;
      var htmlArr = ['<tr><th>序号</th><th>一级分类名称</th><th>二级分类名称</th><th>二级分类LOGO</th></tr>'];
      for (var i = 0; i < rows.length; i++) {
        htmlArr.push('  <tr><td>' + ((QueryObj.page - 1) * QueryObj.pageSize + 1 + i) + '</td><td>' + rows[i].categoryName + '</td><td>' + rows[i].brandName + '</td><td><img src=' + rows[i].brandLogo + ' alt=""></td></tr>');
      }
      $(".lt_data_tbl").html(htmlArr.join(''));
      // 计算总页数
      totalPage = Math.ceil(result.total / QueryObj.pageSize);

      // 设置分页
      setPage();
    })
  }

  // 设置分页
  function setPage() {
    // 配置
    var options = {
      bootstrapMajorVersion: 3,// bootstrap为3.x版本的时候要声明
      alignment: "left",//左侧显示
      currentPage: QueryObj.page,//当前页数
      totalPages: totalPage,//总页数 注意不是总条数

      // 点击页码的时候触发
      onPageClicked: function (e, oe, type, page) {
        // event, originalEvent, type,page。
        // page 为被点击的页码
        QueryObj.page = page;
        // 点击分页按钮 重新发送请求 渲染数据
        querySecondCategoryPaging();
      }
    }

    // 初始化
    $(".pagination").bootstrapPaginator(options);

  }

  // 查询一级分类
  function queryTopCategoryPaging() {
    $.get("/category/queryTopCategoryPaging", { page: 1, pageSize: 1000 }, function (result) {
      // console.log(123);

      var rows = result.rows;
      // <option value=""></option>
      var htmlArr = [];
      for (var i = 0; i < rows.length; i++) {
        htmlArr.push('<option value="' + rows[i].id + '">' + rows[i].categoryName + '</option>');
      }

      $("#categoryId").html(htmlArr.join(''));

    })
  }

  // 初始化文件上传插件
  function initFileUpload() {
    $('.fileuploadBtn').fileupload({
      dataType: 'json',
      // 上传成功的时候调用
      done: function (e, data) {
        // data.result 为上传成功的返回值
        /// 上传成功之后 会执行 
        // console.log(data.result);
        var src = data.result.picAddr;
        // 设置图片的路径
        $(".ff_img").attr("src", src);

        // 设置隐藏的值
        $("#brandLogo").val(src);

        // 手动去掉表单的验证
        // VALID->正确的
        $('#ff').data('bootstrapValidator').updateStatus('brandLogo', 'VALID');
      }
    });

  }

  // 设置表单验证
  function setFormValite() {
    // 对表单进行配置
    var $form = $('#ff').bootstrapValidator({
      /*校验插件默认会忽略  隐藏的表单元素
            不忽略任何情况的表单元素*/
      excluded: [],
      // 图标
      feedbackIcons: {
        valid: 'glyphicon glyphicon-ok',
        invalid: 'glyphicon glyphicon-remove',
        validating: 'glyphicon glyphicon-refresh'
      },
      // 要验证的字段
      fields: {
        // 分类名称-name属性
        brandName: {
          // 用户名的提示信息
          // message: 'The username is not valid',
          validators: {
            // 不能为空
            notEmpty: {
              message: '分类名称不能为空'
            },
            // 提供给ajax回调使用
            callback: {
              message: "用户名不存在"
            }
          }
        },
        brandLogo: {
          // message: 'The username is not valid',
          validators: {
            // 不能为空
            notEmpty: {
              message: '请上传图片'
            },
            // 提供给ajax回调使用
            callback: {
              message: "用户名不存在"
            }
          }
        }
      }
    });

    // 开始启用表单验证 满足验证要求的时候 自己执行
    $form.on('success.form.bv', function (e) {
      // 点击提交的时候  

      // 阻止默认提交事件
      e.preventDefault();

      // 准备发送请求
      var brandName=$("#brandName").val();
      var categoryId=$("#categoryId").val();
      var brandLogo=$("#brandLogo").val();
      var hot="";
      var obj={
        brandName:brandName,
        categoryId:categoryId,
        brandLogo:brandLogo,
        hot:hot
      };

      // 发送请求
      $.post("/category/addSecondCategory",obj,function (result) {
        if(result.success){
          // 关闭模态框
          $('#cateSecondtModal').modal('hide')
          // 刷新数据
          querySecondCategoryPaging();

        }else{
          // 失败
          console.log("提交失败");
        }
        
      })
    });


  }
  // 表单重置 
  $('#cateSecondtModal').on('hide.bs.modal', function (e) {
    // 重置表单 - js 原生的重置  重置 输入框的文字
   $("#ff")[0].reset();
     // 重置验证信息- 插件的重置 重置的是插件自己的图标显示 
   $("#ff").data('bootstrapValidator').resetForm();

   // 重置隐藏域和图片
   $("#brandLogo").val("");
   $(".ff_img").attr("src","./images/none.png");
 })
})